import React,{useState} from "react";
import { Button, Form, Input,Checkbox,message, Select } from 'antd';
import axios from "axios";
import { Value } from "sass";
import { useEffect } from 'react';
import { useNavigate } from 'react-router-dom';
function Schgserver (){
    const [ipt, setipt] = useState("");
    const [a1,seta1]=useState("")
    const [a2,seta2]=useState("")
    const abc = (e: any) => {
        setipt(e.target.value);
        console.log(e.target.value);
      };
      const abc1 = () => {
        console.log(a2)
        axios
          .get(`${a2}${ipt}`)
          
          .then((res) => {
           message.info("删除成功")
           window.location.reload()

          })
          .catch((err) => {
           message.error("删除失败")
           window.location.reload()
          });
      };
  
    const onFinish = (values: any) => {
        axios.post(a1, values).then(res=>{
            message.info("添加成功")
                 
        }).catch(err=>{
            message.error("添加数据失败")

        })
        console.log('Success:', values);
      };
      const onFinishd = (values: any) => {
        axios.get(a2,{
            params:{
                name:values.name,
               
            }
        }).then(res=>{
            message.info("删除成功")

        }).catch(err=>{
            message.error("删除数据失败")

        })
        console.log('Success:', values);
      };
      const onFinishFailed = (errorInfo: any) => {
        console.log('Failed:', errorInfo);
      };
      type FieldType = {
       name?: string;
        remote?: string;
        cloud?: string;
      };
     const handleChange = (value: string) => {  
      
     seta1(value)
     console.log(value)
    
    };
    const h2 = (value:string)=>{
      seta2(value)
      console.log(value)
    }
    const  navigator  = useNavigate()
useEffect(()=>{
  const token = localStorage.getItem("token")
  if(token){
    navigator("/home/schgs")
  }
  else{
    navigator("/err")
  }
 
})
return (
    <>
    <div style={{textAlign:"center"}}>
        <h1 >四川海哥节点20台节点后台管理系统</h1>
    </div>
    
    <div>
     
    </div>
        <h1>添加数据</h1>
        
        <Select  defaultValue="四川海哥"  style={{ width: 120 }}     
      onChange={handleChange}      
      options={[        { value: "http://www.abao-node.cn:300/schg/add/", label: '四川海哥' },     
         { value: 'http://www.abao-node.cn:300/xiaobao/add/', label: '小宝' },           
                ]}   
      />
        <Form
    name="basic"
    labelCol={{ span: 8 }}
    wrapperCol={{ span: 16 }}
    style={{ maxWidth: 600 }}
   
    onFinish={onFinish}
    onFinishFailed={onFinishFailed}
   
  >
    <Form.Item<FieldType>
      label="姓名"
      name="name"
  
    >
      <Input />
    </Form.Item>

    <Form.Item<FieldType>
      label="远程码"
      name="remote"
      
    >
      <Input/>
      </Form.Item>
      <Form.Item<FieldType>
      label="云服务器IP地址"
      name="cloud"
      
    >
      <Input/>
    </Form.Item>

   

    <Form.Item wrapperCol={{ offset: 8, span: 16 }}>
      <Button type="primary" htmlType="submit">
       添加数据
      </Button>
    </Form.Item>
  </Form>
 <div>
<h1> 请输入业主名字进行删除</h1>
业主分组：<Select  defaultValue="四川海哥"  style={{ width: 120 }}     
      onChange={h2}      
      options={[        { value: "http://www.abao-node.cn:300/schg/del/", label: '四川海哥' },     
         { value: 'http://www.abao-node.cn:300/xiaobao/del/', label: '小宝' },       
                 ]}   
      /><br></br>
 业主名字： <Input value={ipt} onChange={abc} style={{ width: 150 }}></Input><br></br>
          <Button type="primary" onClick={abc1}> 删除数据</Button>
           
 </div>
  
    
    </>
)
}
export default Schgserver